<template>
	<view class="box"  :style="{height:myHeight}">

		<view class="image-box">
			<image class="image" src="../../static/images/msg-success.png" mode="aspectFill"></image>
		</view>
<!-- 		<view class="title">
			<text class='titleText' v-if="message.type===3">证书审核结果</text>
			<text class='titleText' v-if="message.type===5">活动参加提醒</text>
		</view> -->
		<view class="message">
			<text class="message-text">{{message.description}}</text>
		</view>
		<view class="time">
			<text class="time-text">通过时间：{{message.time}}</text>
		</view>
		<view class="button">
			<u-button type="primary" text="我知道了" @click="IKnowIt()"></u-button>
		</view>
	</view>
</template>

<script>
	import {
		methods
	} from 'uview-ui/libs/mixin/mixin';
	// import { mapGetters,mapMutations,mapState } from 'vuex'
	export default {
		onLoad(option) {
			// console.log(option.id)
			this.getMsgDetail(option.id)
			
			uni.getSystemInfo({
				 success: (res) => {
				 	 this.myHeight = res.windowHeight+'px'
				 }
			})
		},
		data() {
			return {
				myHeight:0,
				message: {
				},
				bgImageSrc: `${this.$baseUrl}/image/download?name=msgDetail通过.png	`,
			};
		},
		
		methods: {
			getMsgDetail(id) {
				//在这里改变消息状态，已被阅读
				uni.request({
					url: `${this.$baseUrl}/message/modState/${id}`,
					method: 'PUT',
					success: (res) => {
						// console.log(res.data)
						this.message = res.data.data
					}
				})
			},
			IKnowIt(){
				wx.navigateBack({ changed: true });
			}

		}
	}
</script>

<style lang="scss" scoped>
	.box {
		position: relative;
		width: 100%;
		.image-box{
			position: absolute;
			width: 100%;
			height: 136rpx;
			top: 136rpx;
			text-align: center;
			opacity: 1;
			.image{
				height: 136rpx;
				width: 136rpx;
			}
		}
		.message{
			position: absolute;
			top: 304rpx;
			width: 100%;
			height: 46rpx;
			text-align: center;
			.message-text{
				font-size: 32rpx;
				font-weight: 600;
				letter-spacing: 0px;
				line-height: 46rpx;
				color: rgba(51, 51, 51, 1);
				text-align: left;
				vertical-align: top;
			}
		}
		.time{
			position: absolute;
			top: 374rpx;
			height: 34rpx;
			width: 100%;
			text-align: center;
			opacity: 1;
			.time-text{
				font-size: 24rpx;
				font-weight: 400;
				letter-spacing: 0rpx;
				line-height: 34rpx;
				color: rgba(153, 153, 153, 1);
				text-align: left;
				vertical-align: top;
			}
		}
		.button{
		
			position: absolute;
			left: 32rpx;
			top: 528rpx;
			width: 686rpx;
			height: 96rpx;
			opacity: 1;
			border-radius: 8rpx;
		}
	}
</style>
